<template>
  <a-spin :spinning="confirmLoading" >
    <div class="container">
      <div class="auto">
        <div class="pub_tit det_bar clearfix wow fadeInDown animated" data-wow-delay="0.1s" >
          <em class="bt">通知公告详情</em>
          <a-icon style="float: left; margin-top: 16px; margin-right: 8px; cursor: pointer" type="rollback" @click="goBack"/>
        </div>
        <div class="det_wrap">
          <div class="topbox wow fadeInLeftBig animated" data-wow-delay="0.1s">
            <h6 class="title" style="margin-bottom: 0.5em;">{{articleDetail.title}}</h6>
            <span class="fz" style="font-weight: 800; font-size:15px; color: #555;">{{articleDetail.subtitle}}</span>
          </div>
          <div class="editbox wow fadeInUp animated" data-wow-delay="0.1s">
            <p v-html="articleDetail.content" ></p>
          </div>
          <div style="margin-top: 20px;" >
            <div class="bot_bar wow fadeInUp animated" data-wow-delay="0.1s" v-for="item in articleAttachments" :key="item.id">
              <a href="javascript:void(0);" @click="downLoadFile(item)" class="down">{{item.filename}}</a>（下载量{{item.attachmentHits}}）
            </div>
          </div>
          <div class="botbox wow fadeInUp animated" data-wow-delay="0.1s">
            <a href="javascript:void(0);" class="fz" v-for="item in labels" :key="item.id">{{item.name}}</a>
            <span class="date fr">发布于 {{articleDetail.createDate}}</span>
          </div>
        </div>
      </div>
    </div>
  </a-spin>
</template>

<script>
import Footer from './footer/Footer'
import '../../public/css/style.css'
import { getAction, postAction } from '@/api/manage'
export default {
  name: 'NoticeNoticeDetail',
  components: {
    Footer
  },
  beforeRouteEnter (to, from, next) {
    window.scrollTo(0, 0);
    next();
  },
  data() {
    return {
      confirmLoading: false,
      articleDetail: {},
      labels: [],
      articleAttachments: []
    }
  },
  created() {
    this.getArticleDetail()
  },
  methods: {
    downLoadFile(item) {
      let self = this
      postAction('/articleAttachment/updatehits', {id: item.id}).then(res => {
        if(res.code == 0) {
          self.getArticleDetail()
          window.open(item.attachment)
        } else {
          self.$message.error(res.msg)
        }
      })
    },
    goBack() {
      this.$router.go(-1)
    },
    getArticleDetail() {
      let self = this
      this.confirmLoading = true
      let url = '/article/info/' + this.$route.query.noticeId
      getAction(url, {}).then(res => {
        if(res.code == 0) {
          self.articleDetail = Object.assign({}, res.result)
          self.articleAttachments = [...res.result.articleAttachments]
          self.labels = [...res.result.articleLabels]
        } else {
          self.$message.error(res.msg)
        }
      }).finally(() => {
        self.confirmLoading = false
      })
    }
  }
};
</script>

<style scoped>
</style>
